<template>
  <div :class="['checkbox','cursorD',{activeColor:item.checked}]" :data-id="item.id" :label="item.id">
    <div class="checkbox__input" @mousedown.stop="handleCheck(item)">
      <i v-if="father.name!='常用'?item.isShow:item.type=='common'" class="el-icon-success activeColor"></i>
      <span v-else class="checkbox__inner"></span>
    </div>
    <div class="checkbox__label">
      <i :class="item.source"></i>
      <p >{{item.name}}</p>
    </div>
  </div>
  <!--<div>-->
    <!--<el-checkbox :data-id="item.id" v-model="item.checked" :label="item.id" @chenge="handleCheck(item)">-->
      <!--<i :class="item.source"></i>-->
      <!--<p>{{item.name}}</p>-->
    <!--</el-checkbox>-->
  <!--</div>-->
</template>
<script>
  import { ContainerMixin, ElementMixin } from 'vue-slicksort';
  import {menuSet} from "../api/system/menu";

  export default {
    mixins: [ElementMixin],
    props:{
      item:[Object],
      father:[Object],
      index:[String,Number],
      ind:[String,Number],
    },
    data(){
      return{

      }
    },
    watch:{
      item:{
        handler(){
        },immediate:true,deep:true
      }
    },
    methods: {
      handleCheck(item) {
        this.$emit('checkF',this.father,this.ind,this.index,item)
      },
    }
  }
</script>
<style>

</style>
